<template>
  <el-dialog
    top="30px"
    width="1000px"
    class="dialog-sm"
    append-to-body
    :close-on-click-modal="false"
    :before-close="beforeClose"
    :visible.sync="visible"
  >
    <el-tabs>
      <el-tab-pane label="放款登记">
        <register-reply
          :viewMode="viewMode"
          :related-data="relatedData"
          @success="handleEditSuccess"
          @dismiss="beforeClose"
          :loading="loading"
        ></register-reply>
      </el-tab-pane>
    </el-tabs>
  </el-dialog>
</template>

<script>
import RegisterReply from '@/credit/views/county/mission/RegisterReply'

export default {
  components: {
    RegisterReply,
  },
  props: {
    viewMode: Boolean,
    visible: Boolean,
    relatedData: {
      type: Object,
      default: () => ({}),
    },
  },
  data() {
    return {
      loading: false,
    }
  },
  computed: {
    relatedId() {
      return this.relatedData.customer_related_id || ''
    },
  },
  watch: {
    relatedData: {
      handler: function () {
        this.getData()
      },
      deep: true,
      immediate: true,
    },
  },
  created() {},
  mounted() {},
  methods: {
    beforeClose() {
      this.$emit('update:visible', false)
    },

    handleEditSuccess() {
      this.getData()
      this.beforeClose()
      this.$emit('success', true)
    },

    async getData() {
      this.loading = true
      await this.$utils.promise(
        Promise.all([this.$store.dispatch('getEntrustContract', this.relatedId)])
      )
      this.loading = false
    },
  },
}
</script>
<style lang="scss" scoped></style>
